<!doctype html>
<html>

	<head>
		<meta charset="utf-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="../css/mui.min.css" rel="stylesheet" />
		<style>
			*,
		:before,
		:after {
		    box-sizing: border-box;
		}
		body {
		    background: #424242;
		}
		form {
		    width: 320px;
		    margin: 25px auto;
		}
		form h1 {
		    font-size: 1.5em;
		    font-weight: 400;
		    text-align: center;
		    color: #2196F3;
		}
		form h5 {
			font-size: 1em;
		    text-align: left;
		    text-transform: uppercase;
		    color: #c6c6c6;
		}
		form hr.sep {
		    background: #2196F3;
		    box-shadow: none;
		    border: none;
		    height: 2px;
		    width: 95%;
		    margin: 20px auto 45px auto;
		}
		.group {
		    position: relative;
		    margin: 45px 0;
		}
		textarea {
		    resize: none;
		}
		input,
		textarea {
		    background: none;
		    color: #c6c6c6;
		    font-size: 18px;
		    padding: 10px 10px 10px 5px;
		    display: block;
		    width: 320px;
		    border: none;
		    border-radius: 0;
		    border-bottom: 1px solid #c6c6c6;
		}
		input:focus,
		textarea:focus {
		    outline: none;
		}
		input:focus ~ label,
		input:valid ~ label,
		textarea:focus ~ label,
		textarea:valid ~ label {
		    top: -14px;
		    font-size: 12px;
		    color: #2196F3;
		}
		input:focus ~ .bar:before,
		textarea:focus ~ .bar:before {
		    width: 320px;
		}
		input[type="password"] {
		    letter-spacing: 0.3em;
		}
		label {
		    color: #c6c6c6;
		    font-size: 16px;
		    font-weight: normal;
		    position: absolute;
		    pointer-events: none;
		    left: 5px;
		    top: 1px;
		    -webkit-transition: 300ms ease all;
		    transition: 300ms ease all;
		}
		.bar {
		    position: relative;
		    display: block;
		    width: 320px;
		}
		.bar:before {
		    content: '';
		    height: 2px;
		    width: 0;
		    bottom: 0px;
		    position: absolute;
		    background: #2196F3;
		    -webkit-transition: 300ms ease all;
		    transition: 300ms ease all;
		    left: 0%;
		}
		.btn {
		    background: #fff;
		    color: #959595;
		    border: none;
		    padding: 5px ;
			height: 2.125rem;
		    border-radius: 3px;
			text-align:center;
			vertical-align:middle;
		    text-transform: uppercase;
		    text-decoration: none;
		    outline: none;
		    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
		    -webkit-transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
		    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
		}
		.btn:hover {
		    color: #8b8b8b;
		    box-shadow: 0 7px 14px rgba(0, 0, 0, 0.18), 0 5px 5px rgba(0, 0, 0, 0.12);
		}
		.btn.btn-link {
		    background: #2196F3;
		    color: #d3eafd;
		}
		.btn.btn-link:hover {
		    background: #0d8aee;
		    color: #deeffd;
		}
		.btn.btn-submit {
		    background: #2196F3;
		    color: #bce0fb;
		}
		.btn.btn-submit:hover {
		    background: #0d8aee;
		    color: #deeffd;
		}
		.btn.btn-cancel {
		    background: #eee;
		}
		.btn.btn-cancel:hover {
		    background: #e1e1e1;
		    color: #8b8b8b;
		}
		.btn-box {
		    text-align: left;
		    margin: 0.5rem 0;
		}
		
}
				</style>
	</head>

	<body>
		<script src="../js/jquery-1.7.2.min.js"></script>
		<script src="../js/mui.min.js"></script>
		<script type="text/javascript">
			mui.init()
			$.ajax({
				url: window.localStorage.getItem("url") + "home/getInfo",
				data: {
					'aid': window.localStorage.getItem("aid"),
					'uid': window.localStorage.getItem("u_id")
				},
				type: 'GET',
				dataType: 'JSON',
				contentType: "application/x-www-form-urlencoded; charset=UTF-8",

				cache: false,
				processData: true,
				success: function(data) {
					if (data != null) {
						var j = JSON.stringify(data);
						var jsondata = eval('(' + j + ')');
						window.localStorage.setItem("title", jsondata[0].title)
						if(jsondata[0].cc == 0){
							window.localStorage.setItem("type", '#000000')
						}else{
							window.localStorage.setItem("type", '#2196F3')
						}
						$("#h1").html(jsondata[0].title);
						$("#up").html(jsondata[0].up);
						$("#down").html(jsondata[0].down);
						window.localStorage.setItem("up", jsondata[0].up);
						window.localStorage.setItem("down", jsondata[0].down);
						window.localStorage.setItem("hot", jsondata[0].hot);
						$("#h5").html(jsondata[0].context);
					} else {
						mui.toast('不知道怎么肥事，不起作用了┐(´∇｀)┌');
					}

				},
				error: function(XMLHttpRequest, textStatus, errorThrown) {
					//异常处理；
					alert(textStatus);
				}
			});
			
			
			mui.plusReady(function() {
				var ws = plus.webview.currentWebview();
				function clickButton() {
					if(window.localStorage.getItem("type") == "#2196F3")
						mui.toast("已经收藏！");
					else{
						$.ajax({
							url: window.localStorage.getItem("url") + "home/collect",
							data: {
								'collect.aid': window.localStorage.getItem("aid"),
								'collect.uid': window.localStorage.getItem("u_id")
							},
							type: 'GET',
							dataType: 'JSON',
							contentType: "application/x-www-form-urlencoded; charset=UTF-8",
						
							cache: false,
							processData: true,
							success: function(data) {
								var j = JSON.stringify(data);
								var jsondata = eval('(' + j + ')');
								if (jsondata.status == "success") {
									mui.toast('收藏成功！');
									window.location.reload();
								} else {
									mui.toast('不知道怎么肥事，不起作用了┐(´∇｀)┌');
								}
						
							},
							error: function(XMLHttpRequest, textStatus, errorThrown) {
								//异常处理；
								alert(textStatus);
							}
						});
					}
				}
				ws.setStyle({
					"titleNView": {
						backgroundColor: '#000000', //导航栏背景色
						titleText: window.localStorage.getItem("title"), //导航栏标题
						titleColor: '#FFFFFF', //文字颜色
						type: 'transparent', //透明渐变样式
						buttons: [{
							float: 'right',
							type: 'favorite',
							background:window.localStorage.getItem("type"),
							onclick: clickButton
						}],
						autoBackButton: false, //自动绘制返回箭头
						splitLine: { //底部分割线
							color: '#cccccc'
						}
					}
				})
			});
			mui('.wrapper').scroll({
				deceleration: 0.00005 //flick 减速系数，系数越大，滚动速度越慢，滚动距离越小，默认值0.0006
			});
			
			function up(){
				event.stopPropagation();
				$.ajax({
					url: window.localStorage.getItem("url") + "home/up",
					data: {
						'answer.aid': window.localStorage.getItem("aid"),
						'answer.up': window.localStorage.getItem("up"),
						'answer.hot': window.localStorage.getItem("hot")
					},
					type: 'GET',
					dataType: 'JSON',
					contentType: "application/x-www-form-urlencoded; charset=UTF-8",
				
					cache: false,
					processData: true,
					success: function(data) {
						var j = JSON.stringify(data);
						var jsondata = eval('(' + j + ')');
						if (jsondata.status == "success") {
							$("#up").html(window.localStorage.getItem("up")+1);
						} else {
							mui.toast('不知道怎么肥事，不起作用了┐(´∇｀)┌');
						}
						
				
					},
					error: function(XMLHttpRequest, textStatus, errorThrown) {
						//异常处理；
						alert(textStatus);
					}
				});
			}
			function down(){
				event.stopPropagation();
				$.ajax({
					url: window.localStorage.getItem("url") + "home/down",
					data: {
						'answer.aid': window.localStorage.getItem("aid"),
						'answer.up': window.localStorage.getItem("down"),
						'answer.hot': window.localStorage.getItem("hot")
					},
					type: 'GET',
					dataType: 'JSON',
					contentType: "application/x-www-form-urlencoded; charset=UTF-8",
				
					cache: false,
					processData: true,
					success: function(data) {
						var j = JSON.stringify(data);
						var jsondata = eval('(' + j + ')');
						if (jsondata.status == "success") {
							$("#down").html(window.localStorage.getItem("down")+1);
						} else {
							mui.toast('不知道怎么肥事，不起作用了┐(´∇｀)┌');
						}
						
				
					},
					error: function(XMLHttpRequest, textStatus, errorThrown) {
						//异常处理；
						alert(textStatus);
					}
				});
			}
		</script>
		<div class="wrapper">
			<form>
				<h1 id="h1">回答者：</h1>
				<hr class="sep" />
				<h5 id="h5"></h5>
			</form>
			<nav class="mui-bar mui-bar-footer " style="height: 54px;">
				<div class="btn-box">
					<span id="up" class="mui-icon mui-icon-arrowup" style="font-size:25px" onclick="up();"></span>
					<span id="down" class="mui-icon mui-icon-arrowdown" style="font-size:25px" onclick="down();"></span>
				</div>
			</nav>

		</div>


	</body>

</html>
